<template>
  <a-modal
    v-model:visible="visible"
    :title="editType === 'radio' ? '编辑' : '批量编辑'"
    width="800px"
    title-align="start"
    align-center
    render-to-body
    :mask-closable="false"
    class="batch-common-dialog"
    @close="closed"
  >
    <div class="secret-level-ara">
      <AdvancedForm
        ref="formRef"
        :items="mainForm"
        :initial-values="initialValues"
        :rules="mainFormRules"
      />
    </div>

    <template #footer>
      <a-button @click="closed">{{ '取消' }}</a-button>
      <a-button type="primary" :disabled="importLoading" @click="save">{{
        '确认'
      }}</a-button>
    </template>
  </a-modal>
</template>

<script setup lang="ts">
  import { ref, defineProps, onMounted, defineEmits, nextTick } from 'vue';
  import AdvancedForm from '@/common/components/cac-components/advanced-forms/index.vue';
  import { editOrderDetailAll } from '@/api/purchase-order/purchaseOrderPreparation';
  import { Message } from '@arco-design/web-vue';

  const emit = defineEmits(['closeDrawer', 'success']);
  const props = defineProps({
    selection: {
      type: Array,
      default: null,
    },
    editType: {
      type: String,
      default: 'batch',
    },
    rowData: {
      type: Object,
      default: null,
    },
  });
  const formRef = ref();
  const initialValues = ref({});
  // const name1 = ref('');
  const importLoading = ref<boolean>(false);
  const visible = ref(true);
  const mainForm = ref([
    {
      span: 8,
      type: 'date',
      labelText: '交货时间',
      fieldName: 'planArrivalDateTime',
      showTime: false,
      valueFormat: 'YYYY-MM-DD',
      format: 'YYYY-MM-DD',
    },
    {
      span: 8,
      type: 'text',
      labelText: '交货地址',
      fieldName: 'deliverToPlace',
    },
    {
      span: 8,
      type: 'text',
      labelText: '指定收货人和联系人电话',
      fieldName: 'deliverToLinkInfo',
    },
    { span: 8, type: 'text', labelText: '批次', fieldName: 'batchLotNo' },
    {
      span: 8,
      type: 'text',
      labelText: '架次',
      fieldName: 'manufactureLotno',
    },
    {
      span: 8,
      type: 'number',
      labelText: '已签订单数（采购）',
      fieldName: 'pmsOrdQty',
    },
    {
      span: 8,
      type: 'number',
      labelText: '含税单价',
      fieldName: 'taxPrice',
      precision: 2,
    },
    {
      span: 8,
      type: 'number',
      labelText: '结算单价',
      fieldName: 'settlementPrice',
      precision: 2,
    },
    {
      span: 8,
      type: 'number',
      labelText: '含税结算单价',
      precision: 2,
      fieldName: 'settlementTaxPrice',
    },
    { span: 8, type: 'text', labelText: '备注', fieldName: 'notes' },
  ]);
  const radioForm = ref([
    {
      span: 8,
      type: 'date',
      labelText: '交货时间',
      fieldName: 'planArrivalDateTime',
      showTime: false,
      valueFormat: 'YYYY-MM-DD',
      format: 'YYYY-MM-DD',
    },
    {
      span: 8,
      type: 'text',
      labelText: '交货地址',
      fieldName: 'deliverToPlace',
    },
    { span: 8, type: 'text', labelText: '批次', fieldName: 'batchLotNo' },
    {
      span: 8,
      type: 'text',
      labelText: '架次',
      fieldName: 'manufactureLotno',
    },
    {
      span: 8,
      type: 'number',
      labelText: '已签订单数（采购）',
      fieldName: 'pmsOrdQty',
    },
    {
      span: 8,
      type: 'number',
      labelText: '不含税单价（采购）',
      fieldName: 'pmsUnitPrice',
      precision: 2,
    },
    {
      span: 8,
      type: 'number',
      labelText: '结算单价',
      fieldName: 'settlementPrice',
      precision: 2,
    },
    { span: 8, type: 'text', labelText: '备注', fieldName: 'notes' },
  ]);
  const mainFormRules = {
    planArrivalDateTime: [{ required: true, message: '请选择' }],
  };

  onMounted(() => {
    if (props.editType === 'radio') {
      mainForm.value = radioForm.value;
      nextTick(() => {
        formRef.value.setFormValues({ ...props.rowData });
      });
    }
  });
  const save = async () => {
    const result = await formRef.value.formObject.validate();
    const formData: { [key: string]: any } = formRef.value.form;
    if (!result) {
      const arr = getParams(formData);
      console.log(arr);
      const res: any = await editOrderDetailAll(arr);
      if (res.code === 200) {
        Message.success('批量编辑成功');
        emit('success');
      }
    }
  };
  const getParams = (formData: any) => {
    if (props.editType === 'radio') {
      const arr: any[] = [{ ...props.rowData, ...formData }];
      return arr;
    }
    const arr = props.selection.map((item: any) => {
      Object.keys(formData).forEach((key) => {
        if (formData[key]) {
          item[key] = formData[key];
        }
      });
      return item;
    });
    return arr;
  };
  const closed = () => {
    emit('closeDrawer');
  };
</script>
